<template>
	<div id="securi_tyset" class="same-change-oldstyle">
		<div class="same-head-box">
			<div class="saem-seat-box">
				<div class="saem-seat-left">
					<span>当前位置：</span>
					<el-breadcrumb separator-class="el-icon-arrow-right">
						<el-breadcrumb-item :to="{ path: '/securityset' }">设置</el-breadcrumb-item>
						<el-breadcrumb-item>安全设置</el-breadcrumb-item>
					</el-breadcrumb>
				</div>
				<div class="saem-seat-right">
					<button class="same-search-btns same-search-export" @click="RefreshFun">刷新</button>
					<!-- <button class="same-search-btns" @click="returnBack">返回</button> -->
				</div>
			</div>
		</div>
		<div class="securitysetwrap">
			<h4 class="four"><i class="el-icon-lock"></i>修改密码</h4>
			<form action="" method="post">
				<div class="formitems">
					<span>旧密码</span>
					<!-- <input type="password" name="oldpass" v-model="oldpass" id="oldpass" value="" placeholder="请输入您的旧密码" /> -->
					<el-input type="password" style="width:300px" name="oldpass" v-model="oldpass" id="oldpass"
						placeholder="请输入您的旧密码" maxlength="20"></el-input>
				</div>
				<div class="formitems">
					<span>新密码</span>
					<!-- <input type="password" name="pass" v-model="pass" id="" value="pass" placeholder="请输入您的新密码(至少6位)" /> -->
					<el-input type="password" style="width:300px" name="pass" v-model="pass" id="pass"
						placeholder="请输入您的新密码(至少6位)" maxlength="20"></el-input>
				</div>
				<div class="formitems">
					<span>确认密码</span>
					<!-- <input type="password" name="repass"  v-model="repass" id="repass" value="" placeholder="请输入您的新密码(至少6位)" /> -->
					<el-input type="password" style="width:300px" name="repass" v-model="repass" id="repass"
						placeholder="请输入您的新密码(至少6位)" maxlength="20"></el-input>
				</div>
			

					<el-button style="margin-top: 20px;" size="medium" type="primary" @click="confirm($event)">确 认</el-button>
				
		
			</form>
		</div>
		<div class="Promptmodelwrap">
			<div class="Promptmodel">
				<img src="../../../static/images/successicon.png" v-show="success" />
				<span v-show="success">操作成功！</span>
				<img src="../../../static/images/failicon.png" v-show="!success" />
				<span v-show="!success">操作成功！</span>
			</div>
		</div>

	</div>
</template>

<script>
	export default {
		name: 'securityset',
		data: function () {
			return {
				success: true,
				oldpass: '',
				pass: '',
				repass: '',
			}
		},
		inject: ["reload"],
		methods: {
			RefreshFun() {
				// 调用reload方法，刷新整个页面
				this.reload();
			},
			//返回
			returnBack() {
				this.$router.back(-1);
			},
			confirm: function (e) {
				var obj = e.target;
				var that = this;
				if (that.oldpass == '') {
					that.$message.error('请输入旧密码'); return false;
				}
				if (that.pass == '') {
					that.$message.error('请输入新密码'); return false;
				}
				if (that.pass.length <= 5) {
					that.$message.error('密码至少六位'); return false;
				}
				if (that.repass == '') {
					that.$message.error('请重复输入新密码'); return false;
				}

				that.$post({
					url: 'Partner/Setup/save_pass',
					data: {
						oldpass: that.oldpass,
						pass: that.pass,
						repass: that.repass
					},
					success: function (data) {
						if (data.code == 1000) {
							// $('.Promptmodelwrap').stop(true, true).fadeIn().delay(1500).fadeOut();	
							that.$message({
								message: data.message,
								type: 'success'
							})
						} else {
							that.$message.error(data.message);
						}
					}
				})

			}
		},
		mounted() {

		},
		watch: {

		}
	}
</script>

<style>
	#securi_tyset .securitysetwrap {
		padding: 0 40px;
	}

	#securi_tyset .securitysetwrap .formitems {
		display: flex;
		align-items: center;
		margin-top: 20px;
	}

	#securi_tyset .securitysetwrap .formitems span {
		width: 100px;
		display: block;
		flex-shrink: 0;
	}



	#securi_tyset .Promptmodel {
		position: absolute;
		width: 350px;
		height: 120px;
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
		margin: auto;
		background-color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		box-shadow: 0 0 10px #333;
		border-radius: 10px;

	}

	#securi_tyset .Promptmodel img {
		margin-right: 20px;
		width: 50px;
	}

	#securi_tyset .Promptmodelwrap {
		display: none;
	}
	
</style>
<style scoped>
	.four{
		color: #2C5586;
	}
	.four i{
		margin-right: 10px;
	}
</style>